const { resolve, join } = require('path');
const WebpackBar = require("webpackbar");
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
// const HtmlWebpackPlugin = require('html-webpack-plugin')
const merge = require("webpack-merge");
const argv = require("yargs-parser")(process.argv.slice(2));
const _mode = argv.mode || "development";
const _mergeConfig = require(`./config/webpack.${_mode}.js`);
const resolvePath = dir => join(__dirname, dir)
const webpackConfig = {
    cache: {
        type: "filesystem",
    },
    devtool: _mode === 'development' ? 'source-map' : false,
    entry: {
        main: resolve( './src/main.tsx')
    },
    module: {
        rules: [
            {
                test: /\.(js|jsx|ts|tsx)$/,
                exclude: /(node_modules|bower_components)/,
                // use: babelLoader
                // {
                //     loader: "swc-loader",
                // },
                use:[
                    {
                        loader: "thread-loader",
                        options: {
                            workers: 2,
                            workerParallelJobs: 50,
                            workerNodeArgs: ['--max-old-space-size=1024'],
                            poolRespawn: false,
                            poolTimeout: 2000,
                            poolParallelJobs: 50,
                            name: "my-pool"
                        }
                    },"cache-loader",{loader: 'babel-loader'}
                ]
            },
            {
                test: /\.css$/i,
                use: [{
                        loader: MiniCssExtractPlugin.loader, //加了就没有style-loader
                        options: {
                            esModule: true,
                        },
                    },
                    {
                        loader: 'css-loader',
                        // loader: 'css-loader!css-loader?modules',
                        options: {
                            importLoaders: 1,
                            // module:true
                        }
                    },
                    'postcss-loader'
                ],
            },
            // {
            //     test:/\.(png|jpg|jpeg|gif)$/,
            //     type:"asset",
            // }
            {
                test:/\.(png|jpg|jpeg|gif)$/,
                use:[{
                        loader:"url-loader",
                        options:{
                            limit:50000,
                            esModule: false,
                            outputPath: 'images/'
                        }
                    }
                    // ,"image-webpack-loader"
                ]
            }
        ],
    },
    // externals: {
    //     // react: "React",
    //     // "react-dom": "ReactDOM",
    //     // "react-router-dom": "ReactRouterDOM",
    //     // recoil: "Recoil",
    // },
    optimization: {
        runtimeChunk: {
            name: "runtime"
        },
        //规则
        splitChunks: {
            chunks: "all",
            maxAsyncRequests: 5,
            maxInitialRequests: 4,
            // enforceSizeThreshold: 50000,
            minChunks: 2,
            cacheGroups: {
                // vendors: {
                //   name: `chunk-vendors`,
                //   test: /[\\/]node_modules[\\/]/,
                //   priority: -10,
                // },
                commons: {
                    // chunks: 'initial',
                    test: /src\/tools/,
                    // priority: -20,
                    name: "commons",
                    // minChunks:2,
                    enforce: true,
                    // reuseExistingChunk: true
                }
            },
            //只有超过了这个字节的才会打包
            // 要不要打这个总包出来
            minSize: {
                javascript: 0,
                style: 0
            },
            //经验值 拆掉abc ->总包
            maxSize: {
                javascript: 110000,
                style: 110000
            }
        }
    },
    resolve: {
        alias: {
            "@layout": resolve("src/layout"),
            "@components": resolve("src/components"),
            "@services": resolve("src/services"),
            "@tools": resolve("src/tools"),
            "@atoms": resolve("src/recoil/atoms"),
            "@selectors": resolve("src/recoil/selectors"),
            "@views": resolve("src/views"),
            "@api": resolve("src/api"),
            "@hooks": resolve("src/hooks"),
            "@routes": resolve("src/routes"),
            "@css": resolve("src/assets/css"),
            "@img": resolve("src/assets/img"),
        },
        extensions: [".js", ".ts", ".tsx", "jsx", ".css"],
    },
    plugins: [ new WebpackBar() ],
    experiments: {
        asset: true,
    },
}
module.exports = merge.default(webpackConfig, _mergeConfig);